fix(virtual-core): fix Error: Unexpected undefined in scrollToIndex
#1004
Conversation
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Before the this code runs, we already verify that the offset for a
specific index exists. If this is not the case, then we bail by just
using a `return`
However, the code changed in this commit then assumes that the same
conditions hold true. However, this is also running in a `setTimeout`
which means that values could have changed in the meantime (which can
happen due to React re-renders).
In our particular issue in Headless UI, it's because somebody is
filtering a Combobox while typing. This in turn changes the `enabled`
and `count`
from the `useVirtualizer` options.
How we use it in Headless UI:
```
let virtualizer = useVirtualizer({
enabled: options.length !== 0,
count: options.length,
// …
})
```
Another issue is that because of the `setTimeout`, you can't even catch
this error in user land.
So to fix it, once we check if the offset is still available inside of
the `setTimeout`, we will also just silently bail if it results in
`undefined`.
🦋 Changeset detectedLatest commit: 257fa0d The changes in this PR will be included in the next version bump. This PR includes changesets to release 7 packages
Not sure what this means? Click here to learn what changesets are. Click here if you're a maintainer who wants to add another changeset to this PR |
|
View your CI Pipeline Execution ↗ for commit 257fa0d.
☁️ Nx Cloud last updated this comment at |
piecyk
changed the title
Error: Unexpected undefinedError: Unexpected undefined in scrollToIndex
|
Thanks @RobinMalfait |
Merged
RobinMalfait
added a commit
to tailwindlabs/headlessui
that referenced
this pull request
May 20, 2025
This PR fixes an issue with the `Combobox` component when using the `virtual` mode. We recently already fixed this issue (#3678) by applying a patch on the `@tanstack/virtual-core` package. But this was only applied in cjs builds, not in the esm builds. Instead of trying to fix it in our build process, we decided to just fix it upstream (TanStack/virtual#1004) and this PR bumps the version of `@tanstack/virtual-core` to the latest version (which includes the fix).
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
2 participants
Add this suggestion to a batch that can be applied as a single commit.
This suggestion is invalid because no changes were made to the code.
Suggestions cannot be applied while the pull request is closed.
Suggestions cannot be applied while viewing a subset of changes.
Only one suggestion per line can be applied in a batch.
Add this suggestion to a batch that can be applied as a single commit.
Applying suggestions on deleted lines is not supported.
You must change the existing code in this line in order to create a valid suggestion.
Outdated suggestions cannot be applied.
This suggestion has been applied or marked resolved.
Suggestions cannot be applied from pending reviews.
Suggestions cannot be applied on multi-line comments.
Suggestions cannot be applied while the pull request is queued to merge.
Suggestion cannot be applied right now. Please check back later.
This PR fixes an issue where an
Error: Unexpected undefinedis thrown.For context, we use
@tanstack/virtual-reactin Headless UI for our Combobox component. The Combobox component can be used to show a big list of items and you can also filter the list by typing in theComboboxInput. This is also where the issue exists, if you type something and you have a match, then we will scroll to that position using thevirtualizer.scrollToIndex(activeOptionIndex)API. If nothing matches, then we don't scroll, but our internal list of items will be empty.We use the
useVirtualizerhook like this:This therefore means that the
countwill be0and theenabledwill become false.We tracked down the issue to the few lines of code changed in the PR.
Before this code runs, we already verify that the offset for a specific index exists. If this is not the case, then we bail by just using a
return.However, before we changed the code, the lines changed in this PR assumed that the same conditions hold true. However, this is also running in a
setTimeoutwhich means that values could have changed in the meantime (which can happen due to filtering we mentioned above which causes re-renders).Another issue is that because of the
setTimeout, you can't even catch this error in user land.So to fix it, once we check if the offset is still available inside of the
setTimeout, we will also just silently bail if it results inundefined.Fixes: #879